import { FC, useMemo, useState } from "react";

interface Props {}
const Index: FC<Props> = () => {
  // const sum = () => {
  //   let total = 0;
  //   for (let i = 1; i <= 10000; i++) {
  //     total += i;
  //   }
  //   return total;
  // };
  // const sum = useMemo(() => {
  //   console.log(1);
  //   let total = 0;
  //   for (let i = 1; i <= 10000; i++) {
  //     total += i;
  //   }
  //   return total;
  // }, []);

  const [temp] = useState(2);
  const sum = useMemo(() => {
    console.log(1);
    let total = 0;
    for (let i = 1; i <= 10000; i++) {
      // total += i;
      total += i + temp;
    }
    return total;
    // }, []);  // temp永远是2  不管你怎么变
  }, [temp]); // 监控temp变化

  return (
    <fieldset>
      <legend>12-useMemo</legend>
      {sum}
      <br />
      {sum}
      <br />
      {sum}
      <br />
      {sum}
      <br />
      {sum}
      <br />
      {sum}
      <br />
      {sum}
      <br />
      {sum}
      <br />
      {sum}
      <br />
      {sum}
      <br />
    </fieldset>
  );
};

export default Index;
